<template>
  <div>
    <el-table v-loading="loading" :data="list" border fit highlight-current-row>
      <el-table-column align="center" width="80px" label="ID">
        <template slot-scope="scope">
          <span>{{ scope.row.id }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="140px" label="名称">
        <template slot-scope="scope">
          <span>{{ scope.row.name }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="140px" label="主账号">
        <template slot-scope="scope">
          <span>{{ scope.row.account }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="120px" label="二级域名">
        <template slot-scope="scope">
          <span>{{ scope.row.domain }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="140px" label="加入时间">
        <template slot-scope="scope">
          <span>{{ scope.row.createdAt | parseTime('{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column align="center" width="180px" label="到期时间">
        <template slot-scope="scope">
          <span>{{ scope.row.expiration | parseTime('{y}-{m}-{d}') }}
          </span>
          <el-tag type="success" style="margin-left: 5px; width: 60px">
            {{ Math.floor((new Date(scope.row.expiration).getTime() - Date.now()) /(24 * 3600 * 1000)) }} 天
          </el-tag>
        </template>
      </el-table-column>
      <el-table-column align="center" label="编辑" width="auto">
        <template slot-scope="scope">
          <router-link :to="'/org/edit/'+scope.row.id">
            <el-button type="primary" size="small">详细</el-button>
          </router-link>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: 'OrgTable',
  props: {
    list: {
      type: Array,
      default: function() {
        return []
      }
    },
    loading: {
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
    }
  },
  methods: {
  }
}
</script>

<style scoped>

</style>
